<template>
  <div class="margin_top white_bac pading1 flex flex_vertical_center flex_between">
    <div class="payTypeTitle flex flex_vertical_center">
      <img class="margin_right" src="../../components/mall/img/pay_type.png">
      <span>支付方式：</span>
    </div>
    <div class="payTypeText flex" v-if="isShowPayType">
      <mu-flex class="select-control-row" :key="'radio0 '" @click="changeRadio" v-if="online_pay ==1">
        <mu-radio :value="0" v-model="radio" :label="'微信支付'" stype="font-size:12px"></mu-radio>
      </mu-flex>
      <mu-flex class="select-control-row" :key="'radio1 '" @click="changeRadio" v-if="offline_pay == 1">
        <mu-radio :value="1" v-model="radio" :label="'货到付款'" stype="font-size:12px"></mu-radio>
      </mu-flex>
    </div>
    <div class="payTypeText flex" v-if="!isShowPayType">
      <p>您暂未设置支付方式</p>
    </div>
  </div>
</template>

<script>
    export default {
      data(){
        return{
          tabs: ["微信支付",'货到付款'],
          radio:0,
          isShowPayType:true,
          offline_pay:0,
          online_pay:0
        }
      },
      mounted(){
        this.initPayType();
      },
      methods:{
        initPayType(){
          this.yesS.getPayType(
            this.$comParams()
          ).then(res => {
            console.log(res)
            var status = res.status;
            this.offline_pay =res.data.pay_method.offline_pay;
            this.online_pay = res.data.pay_method.online_pay;
            if(status == 1){
              this.isShowPayType = true;
            }

          })
        },
        changeRadio(){
          this.$emit('radioValue', this.radio)
        }
      },
        name: "pay-type-choose"
    }
</script>

<style scoped>
  .margin_top {
    margin-top: 0.5rem;
  }
  .payTypeTitle img{
    width: 1rem;
    height: 1rem;
  }
  .margin_right {
    margin-right: 0.2rem;
  }
  .mu-radio{
    margin-left: 0.5rem;
  }

</style>
